<template>
  <div>
<Navbar :navtitle="titles"></Navbar>
   <div  class="top-one">
             <div class="top-two">
                  <div class="top-text">
                      <router-link to="/commodity" class="bb">商品</router-link>
                       <router-link to="/supply" class="bb">货源</router-link>
                  </div>
                  <div class="top-thrss">
                      <img src="../../assets/sousuo.png" alt="">
                      <input type="text" placeholder="搜索商品">
                  </div>
             </div>
   </div>
    <router-view></router-view>
  </div>
</template>

<script>
import Navbar from '@/components/Navbar'
export default {
   components:{
       Navbar,
   },
   data(){
       return{
           titles:"商品管理"
       }
   }
}

</script>
<style lang="scss" scoped>
.bb{
    color: #333333;
}
.top-one{
    .top-two{
        .top-thrss{
            overflow: hidden;
            img{
                width: 0.15rem;
                height: 0.15rem;
                margin: 0 0.12rem;
            }
             display: flex;
             align-items: center;
             height: 0.3rem;
             background: white;
             border-radius: 0.12rem;
             input{
                 outline: none;
                 border: 0px solid transparent;
                 font-size: 0.12rem;
             }
        }
        .top-text{
            margin: 0  0.14rem;
            border-radius:0.12rem; 
            overflow: hidden;
            display: flex;
            background: rgb(150, 7, 7);
            color: #333333;
            a{
                text-align: center;
                // color:red;
                line-height: 0.3rem;
                font-size: 0.14rem;
                width: 0.5rem;
                height: 0.3rem;
                display: block;
            }
        }
        display: flex;
        align-items: center;
         width: 100%;
    }
    background:rgb(233, 52, 52);
    height: 0.6rem;
    width: 100%;
    display: flex;
    //justify-content: space-around;
    align-items: center;
}
.router-link-active{
   color:white;
   background: black;
}
</style>
